/**
 * Created by Xiaosen on 2016/3/6.
 */
app.controller('dashboardController', ['$scope', '$rootScope', '$timeout', 'layoutManager',
    function ($scope, $rootScope, $timeout, layoutManager) {
        var tree = [{
            text: "My Dashboard",
            nodes: [{
                text: "LLP Dashboard",
                nodes: [
                    {
                        text: "New Dashboard",
                        draggable: true
                    }, {
                        text: "New Dashboard 1",
                        draggable: true
                    }
                ]
            }, {
                text: "IPS Dashboard",
                nodes: [{
                    text: "Dashboard 1",
                    draggable: true
                }, {
                    text: "Dashboard 2",
                    draggable: true
                }, {
                    text: "Dashboard 3",
                    draggable: true
                }, {
                    text: "Dashboard 4",
                    draggable: true
                }]
            }]
        }, {
            text: "My Report",
            nodes: [{
                text: "LLP Report",
                nodes: [
                    {
                        text: "New Report"
                    }, {
                        text: "New Report 1"
                    }
                ]
            }, {
                text: "IPS Report",
                nodes: [{
                    text: "Report 1"
                }, {
                    text: "Report 2"
                }, {
                    text: "Report 3"
                }, {
                    text: "Report 4"
                }]
            }]
        }];
        var tmp = $('#dsTree').treeview({
            data: tree,
            showBorder: false,
            levels: 3
        });
        var data = {
            chart: {
                type: 'column'
            },
            title: {
                text: 'Monthly Average Rainfall'
            },
            subtitle: {
                text: 'Source: WorldClimate.com'
            },
            xAxis: {
                categories: [
                    'Jan',
                    'Feb',
                    'Mar',
                    'Apr',
                    'May',
                    'Jun',
                    'Jul',
                    'Aug',
                    'Sep',
                    'Oct',
                    'Nov',
                    'Dec'
                ]
            },
            yAxis: {
                min: 0,
                title: {
                    text: 'Rainfall (mm)'
                }
            },
            tooltip: {
                headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
                pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                '<td style="padding:0"><b>{point.y:.1f} mm</b></td></tr>',
                footerFormat: '</table>',
                shared: true,
                useHTML: true
            },
            plotOptions: {
                column: {
                    pointPadding: 0.2,
                    borderWidth: 0
                }
            },
            series: [{
                name: 'Tokyo',
                data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]

            }, {
                name: 'New York',
                data: [83.6, 78.8, 98.5, 93.4, 106.0, 84.5, 105.0, 104.3, 91.2, 83.5, 106.6, 92.3]

            }, {
                name: 'London',
                data: [48.9, 38.8, 39.3, 41.4, 47.0, 48.3, 59.0, 59.6, 52.4, 65.2, 59.3, 51.2]

            }, {
                name: 'Berlin',
                data: [42.4, 33.2, 34.5, 39.7, 52.6, 75.5, 57.4, 60.4, 47.6, 39.1, 46.8, 51.1]

            }]
        };
        $rootScope.$on('layoutDone', function () {
            $('#rpt001').highcharts(
                data
            );
        });
        $scope.dashboard = {
            isEditing: true,
            edit: function () {
                this.isEditing = true;
                $scope.$emit('displayModeChanged', 'client');
                $timeout(function () {
                    $('#rpt001').highcharts(
                        data
                    );
                    $rootScope.$broadcast('layoutChanged');
                })
            },
            save: function () {
                this.isEditing = false;
                $scope.$emit('displayModeChanged', 'full');
                $timeout(function () {
                    $('#rpt001').highcharts(
                        data
                    );
                    $rootScope.$broadcast('layoutChanged');
                })
            }
        };
    }
]);
